<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>CrowX</title>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="assets/js/html5shiv.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" id="color" href="assets/css/red.css">
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
<link href="assets/css/bootstrap.css" rel="stylesheet">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
<script type="text/javascript" src="assets/js/jquery1.7.2.js"></script>
<script type="text/javascript" src="assets/js/color_switcher.js"></script>
</head>

<body>
<div class="color-switcher" id="choose_color"> <a href="#." class="picker_close"></a>
  <ul>
    <li><a href="#." class="red" id="red"></a></li>
    <li><a href="#." class="green" id="green"></a></li>
    <li><a href="#." class="blue" id="blue"></a></li>
    <li><a href="#." class="orange" id="orange"></a></li>
    <li><a href="#." class="cyan" id="cyan"></a></li>
    <li><a href="#." class="light_pink" id="light_pink"></a></li>
  </ul>
  <div class="clr"></div>
</div>
<!--end color-switcher-->
<header class="header">
  <div class="top_row">
    <div class="container">
      <section class="row-fluid">
        <div class="span12">
          <p class="top_number"><i class="icon-mobile-phone"></i>+123 456 7980 or +123 456 7999</p>
          <ul class="top_social">
            <li><a href="#." class="fb"><i class="icon-facebook"></i></a></li>
            <li><a href="#." class="twtr"><i class="icon-twitter"></i></a></li>
            <li><a href="#." class="gmail"><i class="icon-google-plus"></i></a></li>
            <li><a href="#." class="pintrest"><i class="icon-pinterest"></i></a></li>
            <li><a href="#." class="rss"><i class="icon-rss"></i></a></li>
          </ul>
          <div class="clr"></div>
        </div>
        <!--end span12-->
        
        <div class="clr"></div>
      </section>
      <!--end row-fluid-->
      
      <div class="clr"></div>
    </div>
    <!--end container-->
    
    <div class="clr"></div>
  </div>
  <!--end top_row-->
  <nav>
    <div class="navigation_bg">
      <div class="container">
        <div class="row-fluid">
          <div class="span3"><a href="index.html" class="logo"><img src="assets/images/logo.png" alt="image" /></a></div>
          <div class="span9"> 
            
            <!-- Navbar
================================================== -->
            <div class="navbar">
              <div class="navbar-inner">
                <div class="container">
                  <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class= 			 					"icon-bar"></span> </button>
                  <div class="nav-collapse collapse">
                    <ul class="nav">
                      <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Home<b class="caret"></b><br />
                        <span>start here</span></a>
                        <ul class="dropdown-menu">
                          <li><a href="index.html">Home 1</a></li>
                          <li><a href="index2.html">Home 2</a></li>
                        </ul>
                      </li>
                      <li class="active dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">pages<b class="caret"></b><br />
                        <span>what we do</span></a>
                        <ul class="dropdown-menu">
                          <li><a href="about_us.html">About us</a></li>
                          <li><a href="contact_us.html">Contact us</a></li>
                          <li><a href="faq.html">Faq</a></li>
                          <li><a href="shortcodes.html">Shortcodes</a></li>
                          <li><a href="icons.html">Awsome Icons</a></li>
                          <li><a href="tables.html">Tables</a></li>
                        </ul>
                      </li>
                      <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">portfolio<b class="caret"></b><br />
                        <span>result of our work</span></a>
                        <ul class="dropdown-menu">
                          <li><a href="portfolio1.html">Portfilio one</a></li>
                          <li><a href="portfolio2.html">Portfilio two</a></li>
                          <li><a href="portfolio3.html">Portfilio three</a></li>
                          <li><a href="portfolio4.html">Portfilio four</a></li>
                        </ul>
                      </li>
                      <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">blog<b class="caret"></b><br />
                        <span>what we think</span></a>
                        <ul class="dropdown-menu">
                          <li><a href="blog1.html">Blog right</a></li>
                          <li><a href="blog2.html">Blog left</a></li>
                          <li><a href="blog_detail1.html">Blog right detail</a></li>
                          <li><a href="blog_detail2.html">Blog left detail</a></li>
                        </ul>
                      </li>
                      <li class=""> <a href="contact_us.html">contact us<br />
                        <span>get in touch</span></a> </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="clr"></div>
        </div>
        <!--end row-fluid-->
        
        <div class="clr"></div>
      </div>
      <!--end container-->
      
      <div class="clr"></div>
    </div>
    <!--end navigation_bg--> 
  </nav>
  <div class="clr"></div>
</header>
<!--end header-->

<div class="sub_page_top">
  <div class="container">
    <section class="row-fluid">
      <div class="span8">
        <h1 class="sub_page_hdng">About Page</h1>
        <p>It is a long established fact that a reader will content of a page when looking at its layout. </p>
      </div>
      <div class="span4">
        <ul class="breadcrumb">
          <li><a href="index.html">Home</a> <span class="divider">/</span></li>
          <li><a href="#">pages</a> <span class="divider">/</span></li>
          <li class="active">about us</li>
        </ul>
      </div>
      <div class="clr"></div>
    </section>
    <!--end row-fluid-->
    
    <div class="clr"></div>
  </div>
  <!--end container-->
  
  <div class="clr"></div>
</div>
<!--end sub_page_top-->

<div class="container">
  <div class="welcome_to_crowx">
    <section class="row-fluid">
      <div class="span6 sub_page_crousal">
        <div id="myCarousel" class="carousel slide">
          <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
          </ol>
          <!-- Carousel items -->
          <div class="carousel-inner">
            <div class="active item"><img src="assets/images/sub_page_slider.jpg" alt="image" /></div>
            <div class="item"><img src="assets/images/sub_page_slider2.jpg" alt="image" /></div>
            <div class="item"><img src="assets/images/sub_page_slider.jpg" alt="image" /></div>
          </div>
          <!-- Carousel nav --> 
          
        </div>
        <div class="clr"></div>
      </div>
      <!--end span5-->
      
      <div class="span6 welcome_txt">
        <h1 class="dark">Welcome to <span>Crowx</span></h1>
        <p>Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor.</p>
        <p> Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum et, dapibus sed, urna. Ut convallis, sem sit amet interdum consectetuer, odio augue aliquam leo, nec dapibus tortor nibh sed augue.</p>
        <p> Vestibulum volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar nunc sapien ornare nisl. Phasellus pede arcu.</p>
        <p class="what_we_love">What We Love <i class="icon-html5"></i> <i class="icon-desktop"></i> <i class="icon-mobile-phone"></i></p>
      </div>
      <!--end span5-->
      
      <div class="clr"></div>
    </section>
    <!--end row-fluid-->
    
    <div class="clr"></div>
  </div>
  <!--end welcome_to_crowx-->
  
  <div class="clr"></div>
</div>
<!--end container-->

<section class="meet_our_team">
  <div class="container">
    <h1 class="our_team">Meet Our Team</h1>
    <p class="align_center">Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt <br />
      auctor a ornare odio. Sed non  mauris vitae erat consequat auctor eu in elit. suspendisse in orci enim.</p>
    <div class="row-fluid">
      <div class="span6 team_member"> <img src="assets/images/team_1.jpg" alt="image" />
        <div class="team_member_detail">
          <h3>John Kailoon<span>CEO Founder</span></h3>
          <p>Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
        </div>
        <!--end team_member_detail-->
        
        <ul class="team_social">
          <li><a href="#." class="one"><i class="icon-facebook"></i></a></li>
          <li><a href="#." class="two"><i class="icon-twitter"></i></a></li>
          <li><a href="#." class="three"><i class="icon-google-plus"></i></a></li>
        </ul>
        <div class="clr"></div>
      </div>
      <!--end span6-->
      
      <div class="span6 team_member"> <img src="assets/images/team_2.jpg" alt="image" />
        <div class="team_member_detail">
          <h3>John Kailoon<span>CEO Founder</span></h3>
          <p>Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
        </div>
        <!--end team_member_detail-->
        
        <ul class="team_social">
          <li><a href="#." class="one"><i class="icon-facebook"></i></a></li>
          <li><a href="#." class="two"><i class="icon-twitter"></i></a></li>
          <li><a href="#." class="three"><i class="icon-google-plus"></i></a></li>
        </ul>
        <div class="clr"></div>
      </div>
      <!--end span6-->
      
      <div class="clr"></div>
    </div>
    <!--end row-fluid-->
    
    <div class="row-fluid">
      <div class="span4 team_member_small"> <img src="assets/images/team_3.jpg" alt="image" />
        <div class="team_member_small_detail">
          <h3>John Kailoon<span>CEO Founder</span></h3>
          <p>Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
        </div>
        <!--end team_member_detail-->
        
        <div class="clr"></div>
      </div>
      <!--end span4 team_member_small_detail-->
      
      <div class="span4 team_member_small"> <img src="assets/images/team_4.jpg" alt="image" />
        <div class="team_member_small_detail">
          <h3>John Kailoon<span>CEO Founder</span></h3>
          <p>Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
        </div>
        <!--end team_member_detail-->
        
        <div class="clr"></div>
      </div>
      <!--end span4 team_member_small_detail-->
      
      <div class="span4 team_member_small"> <img src="assets/images/team_5.jpg" alt="image" />
        <div class="team_member_small_detail">
          <h3>John Kailoon<span>CEO Founder</span></h3>
          <p>Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
        </div>
        <!--end team_member_detail-->
        
        <div class="clr"></div>
      </div>
      <!--end span4 team_member_small_detail-->
      
      <div class="clr"></div>
    </div>
    <!--end row-fluid-->
    
    <div class="clr"></div>
  </div>
  <!--end container-->
  
  <div class="clr"></div>
</section>
<!--end meet_our_team-->

<div class="container">
  <section class="row-fluid">
    <div class="span6 why_choose_us">
      <h1 class="dark">Why <span>Choose</span> Us?</h1>
      <ul>
        <li><i class="icon-circle-arrow-right"></i>consectetur aipisc ing elit. Nulla iaculis aliquet augue.</li>
        <li><i class="icon-circle-arrow-right"></i>Lorem ipsum dolor sit amet, consectetur aipisc ing elit. Nulla.</li>
        <li><i class="icon-circle-arrow-right"></i>Nulla iaculis aliquet augue, varius.</li>
        <li><i class="icon-circle-arrow-right"></i>His latine offendit te, atomorum.</li>
        <li><i class="icon-circle-arrow-right"></i>Lorem ipsum dolor sit amet, consectetur.</li>
        <li><i class="icon-circle-arrow-right"></i>His latine offendit te, atomorum scripserit vituperatoribus ut vim.</li>
        <li><i class="icon-circle-arrow-right"></i>Lorem ipsum dolor sit amet, consectetur aipisc ing.</li>
      </ul>
      <div class="clr"></div>
    </div>
    <!--end why choose us-->
    
    <div class="span6 skills">
      <h1 class="dark">OUR <span>skills</span></h1>
      <div id="bar-1"></div>
      <div class="clr"></div>
      <div id="bar-2"></div>
      <div class="clr"></div>
      <div id="bar-3"></div>
      <div class="clr"></div>
      <div id="bar-4"></div>
      <div class="clr"></div>
      <div id="bar-5"></div>
      <div class="clr"></div>
      <div id="bar-6"></div>
      <div class="clr"></div>
      <div class="clr"></div>
    </div>
    <!--end skills-->
    
    <div class="clr"></div>
  </section>
  <!--end row-fluid-->
  
  <div class="clr"></div>
</div>
<!--end container-->

<footer class="footer">
  <div class="container">
    <section class="row-fluid">
      <div class="span3 usefull_links">
        <h2>Usefull Links</h2>
        <ul>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Home</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>About Us</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Services</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Portfolio</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Blog</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Contact Us</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Documentation</a></li>
          <li><a href="#."><i class="icon-long-arrow-right"></i>Wordpress</a></li>
        </ul>
      </div>
      <!--end span3 usefull_links-->
      
      <div class="span3 latest_tweets">
        <h2>Latest Tweets</h2>
        <i class="icon-twitter"></i>
        <p><span>@Smith Apple</span> Lorem Ipsum is simply dummy text of the printing and typesetting industry.<br />
          <span class="date">June 29, 2013</span></p>
        <div class="clr"></div>
        <i class="icon-twitter"></i>
        <p><span>@Smith Apple</span> Lorem Ipsum is simply dummy text of the printing and typesetting industry.<br />
          <span class="date">June 29, 2013</span></p>
        <div class="clr"></div>
      </div>
      <!--end span3 latest_tweets-->
      
      <div class="span3 about_us">
        <h2>About Us</h2>
        <ul>
          <li class="one"><i class="icon-mobile-phone"></i>(+01) 123 456 7890</li>
          <li class="two"><a href="#."><i class="icon-envelope"></i>support@crowx.com</a></li>
          <li class="three"><a href="#."><i class="icon-globe"></i>www.crowx.com</a></li>
          <li class="four"><i class="icon-home"></i>786 Some Place Nice, Rd Nice
            State, Big Country 7860</li>
        </ul>
        <ul class="footer_social">
          <li><a href="#." class="fb"><i class="icon-facebook"></i></a></li>
          <li><a href="#." class="twtr"><i class="icon-twitter"></i></a></li>
          <li><a href="#." class="gmail"><i class="icon-google-plus"></i></a></li>
          <li><a href="#." class="pintrest"><i class="icon-pinterest"></i></a></li>
          <li><a href="#." class="rss"><i class="icon-rss"></i></a></li>
        </ul>
        <div class="clr"></div>
      </div>
      <!--end span3 about_us-->
      
      <div class="span3 recent_post">
        <h2>Recent Posts Widget</h2>
        <div class="footer_post"> <img src="assets/images/recent_widget_1.jpg" alt="image" />
          <p>Lorem ipsum dolor sit amet
            consectetur text.<span>June 29, 2013</span></p>
          <div class="clr"></div>
        </div>
        <!--end footer_post-->
        
        <div class="footer_post"> <img src="assets/images/recent_widget_2.jpg" alt="image" />
          <p>Lorem ipsum dolor sit amet
            consectetur text.<span>June 29, 2013</span></p>
          <div class="clr"></div>
        </div>
        <!--end footer_post-->
        
        <div class="footer_post"> <img src="assets/images/recent_widget_3.jpg" alt="image" />
          <p>Lorem ipsum dolor sit amet
            consectetur text.<span>June 29, 2013</span></p>
          <div class="clr"></div>
        </div>
        <!--end footer_post-->
        
        <div class="clr"></div>
      </div>
      <!--end span3 recent_post-->
      
      <div class="clr"></div>
    </section>
    <!--end row-fluid-->
    
    <div class="clr"></div>
  </div>
  <!--end container-->
  
  <p class="copyright">Copyright &copy; 2013 CrowX. All right reserved.</p>
  <div class="clr"></div>
</footer>
<script src="assets/js/bootstrap-collapse.js"></script> 
<script src="assets/js/bootstrap-dropdown.js"></script> 
<script src="assets/js/bootstrap-carousel.js"></script> 
<script src="assets/js/jqbar.js" type="text/javascript"></script> 
<script>

    $(document).ready(function() {
        $('.carousel').carousel();
    });
	
	$(document).ready(function () {

            $('#bar-1').jqbar({ value:100, barColor: '#e91b23' });

            $('#bar-2').jqbar({ value: 99, barColor: '#e91b23' });

            $('#bar-3').jqbar({ value: 90, barColor: '#e91b23' });

            $('#bar-4').jqbar({ value: 50, barColor: '#e91b23' });

            $('#bar-5').jqbar({ value: 60, barColor: '#e91b23' });

            $('#bar-6').jqbar({ value: 70, barColor: '#e91b23' });



        });

</script>
</body>
</html>
